body {
    background-color: #979797
}


/* 固定宽度的容器 */

.container {
    width: 90%;
    max-width: 980px;
    /*80px*12 +20px =980px*/
    background-color: #fff;
    min-height: 800px;
    margin: 0 auto;
    padding-right: 2.083333%;
}


/* 定义行 */

.row {
    clear: both;
}


/* 定义列 */

.col {
    float: left;
    margin-left: 2.08333333333%;
    /*栅格系统的槽（gutter）*/
    width: 6.25%;
    background-color: #fd5353;
}

.col .span2 {
    width: calc((6.25%)*2+ 2.08333333%*1);
}

.col .span3 {
    width: calc((6.25%)*3 + 2.08333333%*2);
}

.col .span4 {
    width: calc((6.25%)*4 + 2.08333333%*3);
}

.col .span5 {
    width: calc((6.25%)*5 + 2.08333333%*4);
}

.col .span6 {
    width: calc((6.25%)*6 + 2.08333333%*5);
}

.col .span7 {
    width: calc((6.25%)*7+ 2.08333333%*6);
}

.col .span8 {
    width: calc((6.25%)*8+ 2.08333333%*7);
}

.col .span9 {
    width: calc((6.25%)*9+ 2.08333333%*8);
}

.col .span10 {
    width: calc((6.25%)*10 + 2.08333333%*9);
}

.col .span11 {
    width: calc((6.25%)*11 + 2.08333333%*10);
}

.col .span12 {
    width: calc((6.25%)*12+ 2.08333333%*11);
}